<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible"content="ie=7"/>
<title>在线预约</title>
<meta name="description" content="简介">
<meta name="keywords" content="关键字">
<link rel="stylesheet" type="text/css" href="css/onliebooking.css"/>
<link rel="stylesheet" type="text/css" href="css/fadeup.css"/>
<script src=""></script>
<script>
    window.onload=function(){
        var user01=document.getElementsByName("user01")[0];
        var user02=document.getElementsByName("user02")[0];
        var user03=document.getElementsByName("user03")[0];
        var user04=document.getElementsByName("user04")[0];
        var user05=document.getElementsByName("user05")[0];
        user01.onfocus=function(){
                  user01.placeholder="";
               }  
        user02.onfocus=function(){
               user02.placeholder="";
           }
        user03.onfocus=function(){
               user03.placeholder="";
           }
        user04.onfocus=function(){
               user04.placeholder="";
           }
        user05.onfocus=function(){
               user05.placeholder="";
           }
        
    }
</script>

</head>

<body>
<!--头部样式 开始-->
    <div class="header">
        <div class="wrapper">
            <div class="header-link clearfix">
                <div class="logo">
                <a href="#" title="返回主页"><img src="images/logo.png" alt=""></a>
                </div>
                <div class="nav">
                    <ul>
                        <li><a href="index.html">网站首页</a></li>
                        <li class=""><a href="about.html">关于东盛</a>
                            <ul class="">
                                <li ><a href="#">公司简介</a></li>
                                <li><a href="#">企业优势</a></li>
                                <li class="nav-last"><a href="#">企业视频</a></li>
                            </ul>
                        </li>
                        <li><a href="decorationcase.html">装修案例</a>
                             <ul class="">
                                <li ><a href="#">家装案例</a></li>
                                
                                <li class="nav-last"><a href="#">工装案例</a></li>
                            </ul>
                        </li>
                        <li><a href="constructionsite.html">在建工地</a></li>
                        <li><a href="news.html">新闻资讯</a>
                            <ul class="">
                                <li ><a href="#">装修咨询</a></li>
                                <li class="nav-last"><a href="#">企业新闻</a></li>
                            </ul>
                        </li>
                        <li><a href="team.html">设计团队</a></li>    
                         <li><a href="contact.html">联系我们</a>
                            <ul class="">
                                <li ><a href="#">联系东盛</a></li>
                                <li class="nav-last"><a href="#">公司地址</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
<!--头部样式 结束-->
    
<!--banner样式 开始-->
    <div class="banner "><a href="#"  title="郑州东盛装饰有限公司"><img src="images/online-banner.jpg"></a> </div>
<!--banner样式 结束-->

<!--在线预约样式 开始-->
<div class="case">
    <div class="line">
        <div class="line-long"></div>
        <div class="line-shirt"></div>
    </div>
    <div class="wrapper">
        <div class="case-top"><i></i><p>在线预约</p></div>
        <div class="case-pic clearfix"></div>
        <div class="breadcrumb"><p>您当前所在位置:<a href="#" >首页</a>>在线预约</p>
    </div>
    </div>
</div>

<div class="online">
    <div class="wrapper-1 clearfix">
        <div class="left fl">
            <div class="title ">基本信息</div>
            <div class="left-1">
                <i></i><p>业主姓名：</p>
                <input type="text" name="user01" id="user" value="" placeholder="请填写您的姓名">
            </div>
            <div class="left-2">
                <i></i><p>联系手机：</p>
                <input type="text" name="user02" id="user" value="" placeholder="请填写手机号码">
            </div>
            <div class="left-3">
                <i></i><p>建筑面积：</p>
                <input type="text" name="user03" id="user" value="" placeholder="填写平方米">
            </div>
            <div class="left-4">
                <p>楼盘地址：</p>
                <input type="text" name="user04" id="user" value="" placeholder="请填写详细楼盘地址">
            </div>
        </div>

        <div class="right fl">
            <div class="title ">装修意向</div>
            <div class="right-1">
                    <p>设计师：</p>
                    <select name="select" id="select">
                        <option value="1">李爽</option>
                        <option value="2">张建</option>
                        <option value="3" selected="selected">李晶晶</option>
                        <option value="4">丁超</option>
                        <option value="5">王桃玲</option>
                        <option value="6">李政星</option>
                        <option value="7">张伟</option>
                    </select>
                </div> 
                <div class="right-2">
                    <i></i><p>你的户型：</p>
                    <select name="select" id="select">
                        <option value="1">一室一厅</option>
                        <option value="2">两室一厅</option>
                        <option value="3" selected="selected">三室两厅</option>
                    </select>
                </div> 
                <div class="right-3">
                    <i></i><p>装修风格：</p>
                    <select name="select" id="select">
                        <option value="1">田园</option>
                        <option value="2">欧式</option>
                        <option value="3" selected="selected">现代简约</option>
                        <option value="4">古典</option>
                        <option value="5">中国风</option>
                        <option value="6">乡村</option>
                        <option value="7">田园</option>

                    </select>
                </div>
                <div class="right-4">
                    <p>装修要求：</p>
                    <textarea type="textarea" name="user05" id="user" rows="5"placeholder="可填写备注信息"></textarea>
                </div>  
                   
         </div>
        </div>
        <div class="submit">立即提交</div>
</div>
    
<!--底部导航 开始-->
<div class="footer clearfix d4 ">
    <div class="line-long"></div>
    <div class="wrapper clearfix">
        <div class="footer-pic">
            <ul class="pic">
                <li class="clearfix" >
                    <a href="#" class="pic01right fr"></a>
                    <div class="picupdown fl">
                        <a href="#" style="margin:0 0 18px 0"class="picover">
                            <img src="images/about-Quality.png" alt="">
                        </a>
                        <a href="#" class="picup" >
                            <img src="images/tx-txt1.png" alt="">
                        </a>
                    </div>
                </li>
                <li class="clearfix">
                    <a href="#" class="pic02right fr"></a>
                    <div class="picupdown fl">
                        <a href="#" style="margin:0 0 18px 0"class="picover">
                            <img src="images/about-Brand.png" alt="">
                        </a>
                        <a href="#" class="picup" >
                            <img src="images/Brand111.png" alt="">
                        </a>
                    </div>
                </li>
                <li class="clearfix">
                    <a href="#" class="pic03right fr"></a>
                    <div class="picupdown fl">
                        <a href="#" style="margin:0 0 18px 0"class="picover">
                            <img src="images/disign01.png" alt="">
                        </a>
                        <a href="#" class="picup" >
                            <img src="images/design11.png" alt="">
                        </a>
                    </div>
                </li>
                <li class="clearfix" style="margin-right:0">
                    <a href="#" class="pic04right fr"></a>
                    <div class="picupdown fl">
                        <a href="#" style="margin:0 0 24px 0"class="picover">
                            <img src="images/about-Service.png" alt="">
                        </a>
                        <a href="#" class="picup" >
                            <img src="images/service11.png" alt="">
                        </a>
                    </div>
                </li>                   
            </ul>
        </div>
<!--底部导航左部 开始-->
        <div class="footer-left clearfix">
            <div class="left01 clearfix">
                <h3>网站信息</h3>
                <p>Copyright ®2016 郑州东盛互联网家装有限公司 版权所有</p>
                <p>备案号：  豫ICP备16007366号</p>
                <p>技术支持：hxzsky</p>
            </div> 
            <div class="left02 clearfix"> 
                <p class="contact ">在以下网站关注我们 : </p>
                <p class="icon "><a href="#" title="微博"><img src="images/weibo.png" alt=""></a><a href="#" class="icon02"title="微信"><img src="images/weixin.png" alt=""> </a></p>
            </div>
        </div>
<!--底部导航中部 开始-->
        <div class="footer-middle-line clearfix">
            <i></i>
        </div>
        <div class="footer-middle clearfix">
            <div class="footer-m-l">
                <p>联系我们</p>
                <ul class="clearfix">
                    <li >电话：<span>400-820-3452</span></li>
                    <li>传真：<span>（86）235 4521 3242</span></li>
                    <li>网址：<a href="#"><span>www.zz.sainact.com</span></a></li>
                    <li>地址：<span>郑州市绿地财富中心A-1617</span></li>
                </ul>
            </div>
        </div>
<!--底部导航右部 开始-->
        <div class="footer-right-line clearfix">
                <i></i>
        </div>
        <div class="footer-right-01 clearfix">
            <div class="footer-m-l clearfix">
                <p>快速进入</p>
                <ul>
                    <li><a href="#">回到顶部<span></span></a></li>
                    <li><a href="#">工程案例<span></span></a></li>
                    <li><a href="#">施工现场<span></span></a></li>
                </ul>
            </div>  
        </div>
        <div class="footer-right-02 clearfix">
            <div class="footer-m-l clearfix">
                <ul class="footer-right-r clearfix">
                     <li><a href="#">关于东盛<span></span></a></li>
                     <li><a href="#">新闻资讯<span></span></a></li>
                     <li><a href="#">联系我们<span></span></a></li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!--底部导航样式 结束-->
</body>
</html>
